<!--日期-->
<template>
	<el-date-picker
		style="width: 100%"
		v-model="value"
		v-bind="allAttrs"
		:name="'c' + columnId"
		:size="mySize"
		:format="myformat"
		:value-format="myvalueFormat"
		:clearable="clearable"
	>
    <template #[item]="data" v-for="item in Object.keys($slots)">
      <slot :name="item" v-bind="data || {}"></slot>
    </template>
	</el-date-picker>
</template>

<script lang="ts" setup>
// 引入组件需要的属性 引入表单子控件的管理类
import { itemProps, itemController, initDate } from '../lib/mapController';
// 定义属性
const props = defineProps({
	...itemProps, // 基础属性
	modelValue: [String, Date, Number],
});
const attrs = useAttrs();
const emit = defineEmits(['update:modelValue']);
const allAttrs = computed(() => {
	return Object.assign(props.extend, attrs, emit);
});
const state = reactive({
	mySize: allAttrs.value.size,
});
const { value,globalSize } = itemController(props, allAttrs.value, emit);
// 初始化
globalSize(state);

// 输出
const {
	myformat, // 默认的格式化
	myvalueFormat, // 返回值的格式化
} = initDate(allAttrs);
const { mySize } = toRefs(state);
</script>
<script lang="ts">
// 声明额外的选项
export default {
	name: 'zh-date',
	inheritallAttrs: false,
};
</script>
